<template>
    <div>Token: {{ token }}</div>
    <div>是否登录：{{ isLogin ? "已登录" : "未登录" }}</div>
    <el-button @click="loginAction">登录</el-button>
    <el-button @click="logoutAction">退出登录</el-button>
  </template>
  
  <script lang="ts" setup>
  import { storeToRefs } from 'pinia';
  import { useStore } from '~/store/user'; 
  
  const userStore = useStore();
  const { token, isLogin } = storeToRefs(userStore);
  
  // 注意：这里我将 login 重命名为 loginAction，以避免与 authStore 的 login 方法冲突
  const loginAction = () => {
    userStore.login('xxxxx'); // 直接调用存储的 login 方法，并传递一个模拟的 token
    // 注意：由于 login 方法是异步的（尽管在这个示例中是同步模拟的），如果您需要处理登录后的逻辑，您可能需要在 authStore 的 login 方法中添加返回 Promise 的逻辑，并在这里使用 .then() 或 async/await。
  };
  const logoutAction = ()=>{
    userStore.logout();
  }
  </script>